<template>
  <el-dialog
    :title="title"
    :visible.sync="show"
    width="1100px"
    append-to-body
    center
  >
    <div class="search-box">
      <el-form label-width="100px" :inline="true">
        <el-form-item label="关键字">
          <el-input v-model="name" />
        </el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
        <el-button type="warning" icon="el-icon-refresh" @click="reset()">重置</el-button>
      </el-form>
    </div>
    <com-table
      v-model="selectRow"
      highlight-current-row
      :data="dataList"
      :columns="columns"
      :total="total"
      @pageChange="pageChange"
    >
      <!-- <template v-slot:name="{row}">
        <a class="com-link" @click="viewDetail(row)">{{ row.name }}</a>
      </template>
      <template v-slot:options="{row}">
        <el-button type="primary" icon="el-icon-edit" size="mini" @click="editBuildUnit(row)">编辑</el-button>
        <el-button type="danger" icon="el-icon-delete" size="mini" @click="delBuildUnit(row)">删除</el-button>
      </template> -->
      <template v-slot:signTime="{row: {signTime}}">
        {{ dateFormat(signTime) }}
      </template>
      <template v-slot:mode="{row: {mode}}">
        {{ getDictName(materialContractInfoMode, mode) }}
      </template>
      <template v-slot:status="{row: {status}}">
        {{ status | formateFlowStatus }}
      </template>
      <template v-slot:createTime="{row: {createTime}}">
        {{ createTime | date }}
      </template>
    </com-table>
    <span slot="footer" class="dialog-footer">
      <el-button @click="show = false">取 消</el-button>
      <el-button type="primary" @click="confirm">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getMaterialContractFinishInfoList } from '@/api/contractManage'
import { materialContractInfoMode, workflowStatus } from '@/utils/dicData'
import { getDictName } from '@/utils/comm'
import moment from 'moment'
export default {
  name: 'SupplierSelectList',
  props: {
    type: {
      type: String,
      default: ''
    },
    showModal: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      name: '',
      dataList: [],
      getDictName,
      materialContractInfoMode,
      workflowStatus,
      total: 0,
      pageParams: {
        pageNum: 1,
        pageSize: 10
      },
      selectRow: null,
      columns: [
        {
          label: '合同编号',
          prop: 'number',
          width: '180'
        },
        {
          label: '合同名称',
          prop: 'name',
          width: '150'
        },
        {
          label: '签订时间',
          prop: 'signTime',
          slot: 'signTime',
          width: '90'
        },
        {
          label: '采购方式',
          prop: 'mode',
          slot: 'mode'
        },
        {
          label: '合同金额',
          prop: 'contractAmount'
        },
        {
          label: '预付款金额',
          prop: 'prepaymentsAmount',
          width: '100'
        },
        {
          label: '质保金金额',
          prop: 'warrantyAmount',
          width: '100'
        },
        {
          label: '进度款比例',
          prop: 'schedulePercent',
          width: '100'
        },
        {
          label: '预付款比例',
          prop: 'prepaymentsPercent',
          width: '100'
        },
        {
          label: '质保金比例',
          prop: 'warrantyPercent',
          width: '100'
        },
        {
          label: '甲方名称',
          prop: 'employerName'
        },
        {
          label: '乙方名称',
          prop: 'employeeName'
        },
        {
          label: '所属单位',
          prop: 'belongUnit'
        },
        {
          label: '所属项目',
          prop: 'belongProject'
        },
        {
          label: '备注',
          prop: 'remark'
        },
        {
          label: '流程状态',
          prop: 'status',
          slot: 'status'
        },
        {
          label: '编制人',
          prop: 'founderName'
        },
        {
          label: '编制时间',
          slot: 'createTime',
          width: '90'
        }
      ]
    }
  },
  computed: {
    show: {
      get() {
        return this.showModal
      },
      set(val) {
        this.$emit('update:showModal', val)
      }
    },
    title() {
      return ''
    }
  },
  mounted() {
    this.getSupplierInfoList()
  },
  methods: {
    dateFormat(data) {
      if (data) {
        return moment(data).format('YYYY-MM-DD')
      } else {
        return ''
      }
    },
    confirm() {
      this.$emit('getSelectedData', 'agreement', this.selectRow)
      this.show = false
    },
    pageChange(data) {
      this.pageParams = data
      this.getSupplierInfoList()
    },
    reset() {

    },
    search() {

    },
    getSupplierInfoList() {
      const params = {
        ...this.pageParams
      }
      getMaterialContractFinishInfoList(params).then(res => {
        const { data, total } = res.data || {}
        if (data) {
          this.dataList = data
          this.total = total - 0
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
